import React, { Suspense } from 'react'

import { Switch, Route, Redirect } from 'react-router-dom'
import Loading from '../components/Loading'


let Home = React.lazy(() => import(/*webpackChunkName:"home" */'../components/Home/home'))
let Form = React.lazy(() => import(/*webpackChunkName:"form" */'../components/Home/form'))
let About = React.lazy(() => import(/*webpackChunkName:"about" */'../components/Home/about'))

const Routes: React.FC = function () {
  return <>
    <Suspense fallback={<Loading />}>
      <Switch>
        <Route path='/' exact component={Home}></Route>
        <Route path='/form' component={Form}></Route>
        <Route path='/about' component={About}></Route>
        <Route path='/user' component={About}></Route>
        <Redirect path='/*' to='/404' ></Redirect>
      </Switch>
    </Suspense>
  </>
}

export default Routes